<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

    <title>申请详情</title>

    <script src="../../assets/js/jquery-3.4.1.min.js"></script>
    <script src="../../assets/js/constants.js"></script>
    <script src="../../assets/js/bootstrap.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <script src="../../assets/js/layer.js"></script>
    <script src="../../assets/js/util.dev.js"></script>

    <link rel="stylesheet" href="../../assets/css/bootstrap.min.css" id="layuicss-layer">

    <style>
        html,
        body {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }

        .warp {
            width: 100%;
            text-align: left
        }

        .card {
            width: 90%;
            height: 160px;
            display: inline-block;
            background-color: #eee;
            border: 1px solid #ccc;
            border-radius: 5px;
            font-size: 14px;
            padding: 5px;
            margin: 0 auto;
            position: relative;
            margin-top: 20%;
            margin-left: 5%;
        }

        .item-container {
            margin-top: 10px;
            margin-left: 10px;
        }

        .default-text {
            font-size: 18px;
            color: black;
        }

        .phone-text {
            font-size: 18px;
            color: blue;
        }
    </style>
</head>

<body>
    <div id="app" class="warp">
        <div class="card">
            <div class="item-container">
                <span class="default-text">申请人 : </span>
                <span class="default-text">{{applyInfo.name}}</span>
            </div>

            <div class="item-container">
                <span class="default-text">申请额度 : </span>
                <span class="default-text">{{applyInfo.money}}万</span>
            </div>

            <div class="item-container">
                <span class="default-text">联系方式 : </span>

                <a href="tel:applyInfo.phone">
                    <span class="phone-text">{{applyInfo.phone}}</span>
                </a>
            </div>

            <div class="item-container">
                <span class="default-text">申请时间 : </span>
                <span class="default-text">{{applyInfo.time}}</span>
            </div>
        </div>
    </div>

    <script>

        var applyId = util.getParameter("applyId");

        var vue = new Vue({
            el: '#app',
            data: {
                message: 'Hello Vue!',
                applyInfo: {
                    name: 'test',
                    money: 'money',
                    phone: 'phone',
                    time: 'time'
                }
            },
            methods: {
                checkPermission: function () {
                    var requestUrl = getTradeHostName() + "wx/wxManagerLogin"
                    $.ajax({
                        url: requestUrl,
                        type: 'POST',
                        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                        dataType: "json",
                        success: function (result) {
                            if (result.errorCode == 0) {
                                vue.requestInfo()
                            } else {
                                vue.requestRefuse(result.errorMsg)
                            }
                        },
                        error: function (error) {
                            vue.requestRefuse("系统异常")
                        }
                    })
                },
                requestRefuse: function (msg) {
                    var alert = layer.alert(msg, {
                        skin: 'layui-layer-lan',
                        title: '提示',
                        closeBtn: 0
                    }, function () {
                        layer.close(alert)
                        WeixinJSBridge.invoke('closeWindow');
                    });
                },
                requestInfo: function () {
                    var requestUrl = getTradeHostName() + "apply/info"

                    $.ajax({
                        url: requestUrl,
                        type: 'POST',
                        data: {
                            applyId: applyId
                        },
                        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                        dataType: "json",
                        success: function (result) {
                            console.log(result)
                            if (result.errorCode != 0) {
                                vue.requestRefuse(result.errorMsg)
                            } else {
                                vue.applyInfo.name = result.data.name;
                                vue.applyInfo.money = result.data.quota;
                                vue.applyInfo.phone = result.data.tel;
                                vue.applyInfo.time = result.data.applyTime;

                            }
                        },
                        error: function (error) {
                            vue.requestRefuse("系统异常")
                        }
                    })
                }
            },

        })
        vue.requestInfo()
    </script>
</body>


</html>